<script>
import TestData from "./test/TestData.vue"
import Modal from "./components/Modal.vue"
import serviceForm from "./formControl/serviceForm.vue"
import { getDeliveryContent, getRouteList, submitPublish } from "@/api/publish"
import Demand from "./enum/Demand"
import currency from "@/utils/currency"
import GoodsType from "./enum/GoodsType"
import InfoItem from "./components/infoItem.vue"
export default {
	components: { TestData, Modal, serviceForm, InfoItem },
	data() {
		return {
			startDate: '',
			orderId: '',
			currency,
			Demand,
			demandList: [
				{ checked: false, label: this.$t('运输'), value: Demand.YUNSHU },
				{ checked: false, label: this.$t('报关'), value: Demand.BAOGUAN },
				{ checked: false, label: this.$t('转关'), value: Demand.ZHUANGUAN },
				{ checked: false, label: this.$t('清关'), value: Demand.QINGGUAN },
			],
			GoodsType,
			lang: uni.getStorageSync('lang') || "zh",
			//收起路线
			routeListShow: true,
			// 是否同意协议
			isChecked: false,
			checkedModalShow: false,
			remarkModalShow: false,
			showTelModal: false,
			showServiceModal: false,
			id: 1,
			// 运输方式选项
			transportWayTypes: [
				{ id: 0, name: this.$t('不限') },
				{ id: 2, name: this.$t('汽运') },
				{ id: 3, name: this.$t('空运') },
				{ id: 4, name: this.$t('海运') },
				{ id: 5, name: this.$t('铁路') },
				{ id: 1, name: this.$t('其他') }
			],
			transportTypes: [
				{ id: 1, name: this.$t('整车') },
				{ id: 2, name: this.$t('拼车') }
			],
			// 0不限 1其他 2汽运 3空运 4海运 5铁路
			deliveryType: {
				"buxian": 0,
				"qita": 1,
				"qiyun": 2,
				"kongyun": 3,
				"haiyun": 4,
				"tielu": 5
			},
			// 订单备注
			remark: "",
			// 联系电话
			tel: "",
			// 货运期间服务相关协议
			deliveryData: [],
			// 通关服务
			port_service_arr: [],
			// 路线列表
			routeList: []
		}
	},
	onLoad(options) {
		if(options.orderId) {
			console.log('options.orderId---44444', options.orderId)
			this.orderId = options.orderId
		}
		// setTimeout(() => {
		// 	this.showServiceModal = true
		// }, 10)

		// console.log(this.$store.state.publishCommonBody = {
		// 	"delivery_at": "2025-01-20",
		// 	"delivery_type": 0,
		// 	"demand": "1,2,3,4",
		// 	"departure_id": 89,
		// 	"reach_id": 90,
		// 	"goods_id": 51,
		// 	"goods_list": "/uploads/20250120/d41d8cd98f00b204e9800998ecf8427e.docx",
		// 	"goods_num": 1,
		// 	"goods_type": 0,
		// 	"port_service": "demand:4,area_id:2;demand:2,area_id:2;demand:3,area_id:38",
		// 	"price": "1111",
		// 	"price_unit": "￥",
		// 	"related_orders": "",
		// 	"release_type": 1,
		// 	"release_user_id": "1644,1645",
		// 	"remark": "123123123123123",
		// 	"size_id": 2,
		// 	"tel": "13936409973",
		// 	"transfer_id": "",
		// 	"transport_type": 2,
		// 	"transport_way": 2,
		// 	"user_id": 1633,
		// 	"vehicle_id": 2,
		// 	"size_title": "18m",
		// 	"vehicle_title": "高栏车"
		// });
		// console.log(this.$store.state.currentGoodsInfo = {
		// 	"title": this.$t($t('测试{{$t('货物')}}')),
		// 	"package_id": 1,
		// 	"package_name": "123",
		// 	"unload_id": 1,
		// 	"goods_weight": "2.5",
		// 	"goods_volume": "3",
		// 	"goods_num": "100",
		// 	"goods_l": "2.5,3.0",
		// 	"goods_w": "1.8,2.0",
		// 	"goods_h": "1.5,1.8",
		// 	"image": "https://example.com/test.jpg",
		// 	"user_id": 1633,
		// 	"id": 43,
		// 	"title_ru": "Испытание груза ",
		// 	"attachment_id": "101",
		// 	"create_at": "2025-01-17 15:45:19",
		// 	"param": "{\"title\":\"\\u6d4b\\u8bd5\\u8d27\\u7269\",\"package_id\":1,\"package_name\":\"\",\"unload_id\":1,\"goods_weight\":2.5,\"goods_volume\":3,\"goods_num\":100,\"goods_l\":\"2.5,3.0\",\"goods_w\":\"1.8,2.0\",\"goods_h\":\"1.5,1.8\",\"image\":\"https:\\/\\/example.com\\/test.jpg\",\"user_id\":1633,\"token\":\"1a1b313c-81f4-499d-bc7b-126ca3a1aef5\",\"version\":\"2.0.6\",\"lang\":\"{\\\"type\\\":\\\"string\\\",data:\\\"zh\\\"}\"}",
		// 	"package": {
		// 		"id": 1,
		// 		"title": "平板车",
		// 		"title_ru": "平板车"
		// 	},
		// 	"unload": {
		// 		"id": 1,
		// 		"title": "平板车",
		// 		"title_ru": "平板车"
		// 	},
		// 	"attachment": [
		// 		{
		// 			"id": 101,
		// 			"path": "https://example.com/test.jpg"
		// 		}
		// 	]
		// });

		// this.$store.state.publishDeparture = {
		// 	area: {
		// 		id: 2,
		// 		mergename: this.$t('北京')
		// 	},
		// 	content: "测试出发地内容"
		// }
		// this.$store.state.publishReach = {
		// 	area: {
		// 		id: 84,
		// 		mergename: this.$t('莫斯科')
		// 	},
		// 	content: "测试到达地内容"
		// }
		//获取货运期间{{$t('服务')}}相关协议
		this.getDeliveryContent()
		//{{$t('价格单位')}}初始化
		this.$store.state.publishCommonBody.price_unit = 'CNY'


		this.$store.state.publishCommonBody.is_load = 0
		this.$store.state.publishCommonBody.is_stock = 0
		this.startDate =  this.getNowFormatDate();
		// {{$t('获取路线列表')}}
		this.getRouteList()

	},
	methods: {
		getNowFormatDate() {
			let date = new Date(),
			year = date.getFullYear(), //获取完整的年份(4位)
			month = date.getMonth() + 1, //获取{{$t('当前')}}月份(0-11,0代表1月)
			strDate = date.getDate() // 获取{{$t('当前')}}日(1-31)
			if (month < 10) month = `0${month}` // 如果月份{{$t('是')}}个位数，在前面补0
			if (strDate < 10) strDate = `0${strDate}` // 如果日{{$t('是')}}个位数，在前面补0
			console.log('this.startDate---', `${year}-${month}-${strDate}`)
			return `${year}-${month}-${strDate}`
		},
		async getDeliveryContent() {
			const res = await getDeliveryContent()
			res.data.data.data[0].content = res.data.data.data[0].content.replace(/<o:p>/g, "").replace(/<\/o:p>/g, "")
			res.data.data.data[1].content = res.data.data.data[1].content.replace(/<o:p>/g, "").replace(/<\/o:p>/g, "")
			this.deliveryData = res.data.data.data

		},
		async submit() {
			if (!this.isChecked) {
				return uni.showToast({
					title: this.$t('请阅读并同意货运区间服务相关协议'),
					icon: "none"
				})

			}

			/*检查如果勾选了服务，但是没选择地址 */
			const serviceValidateRes = this.$store.state.publishCommonBody.demand.split(',').map(Number).filter(item => item != 1).every(demandType => {
				return this.port_service_arr.some(item => item.demand == demandType)
			})
			if (!serviceValidateRes) {
				return uni.showToast({
					title: this.$t('请选择通关服务'),
					icon: "none"
				})

			}
			//检查{{$t('装货时间')}}
			if (!this.$store.state.publishCommonBody.delivery_at) {
				return uni.showToast({
					title: this.$t('请选择装货时间'),
					icon: "none"
				})

			}

			//检查{{$t('货主出价')}}
			// if (!this.$store.state.publishCommonBody.price) {
			// 	uni.showToast({
			// 		title: "请输入货主出价",
			// 		icon: "none"
			// 	})
			// 	return
			// }

			const obj = this.$store.state.publishCommonBody;
			delete obj.size_title;
			delete obj.vehicle_title;
			delete obj.railway_wagon_title;
			// console.log('obj----',obj);
			// return;
			uni.showLoading({
				title: this.$t('提交中'),
				mask: true
			});
			const res = await submitPublish(obj)
			uni.hideLoading()
			console.log('res---', res)
			// return
			console.log('this.orderId---55555', this.orderId)
			if (res.data.code == 200) {
				if(this.orderId) {
					uni.showToast({
						title: '发布成功',
						icon: "none"
					})
					setTimeout(() => {
						uni.redirectTo({
						  url:`/pages/caigou/orderDetail/index?orderId=${this.orderId}&confirmModal=true&yunzongId=${res.data.data.data.id}`,
						  webview: 'zWebViewShop',
						})
					}, 1000)
					
				} else {
					uni.redirectTo({
						url: "/pages/publish/formControl/result",
						notInFrame: true
					})
				}
				
			} else {
				uni.showToast({
					title: res.data.message || this.$t('提交失败'),
					icon: "none"
				})
			}

		},
		goServiceSetting() {
			uni.navigateTo({
				url: "/pages/publish/formControl/serviceForm"
			})
		},
		back() {
			// uni.navigateBack()
			this.cback()
		},
		remarkConfirm() {
			if (this.remark.length < 10 || this.remark.length > 100) {
				uni.showToast({
					title: "{{$t('请输入')}}10-100个字符",
					icon: "none"
				})
				return
			}
			this.remarkModalShow = false;
			this.$store.state.publishCommonBody.remark = this.remark;
		},
		telConfirm() {
			//{{$t('手机号')}}验证 包含{{$t('俄罗斯')}}
			if (this.tel.length < 10) {
				uni.showToast({
					title: this.$t('请输入正确的手机号'),
					icon: "none"
				})
				return
			}
			this.showTelModal = false;
			this.$store.state.publishCommonBody.tel = this.tel;
		},
		changePriceUnit() {
			this.$store.state.publishCommonBody.price_unit = this.$store.state.publishCommonBody.price_unit == '￥' ? '₽' : '￥'
		},
		async confirmService(data) {
			console.log(data,'报关');
			this.port_service_arr = []
			//整合 出发地 目的地 通关服务获取新的路线列表
			//清关 报关检查status
					//报关插入
					if (data.baoCity.id && data.baoCity.status) {
				this.port_service_arr.push({
					demand: Demand.BAOGUAN,
					area_id: data.baoCity.id
				})
			}
				//转关插入
				data.zhuanCityList.forEach(item => {
				if (item.id){
					this.port_service_arr.push({
						demand: Demand.ZHUANGUAN,
						area_id: item.id
					})
				}
			
			})
			//清关插入
			if (data.qingCity.id && data.qingCity.status) {
				this.port_service_arr.push({
					demand: Demand.QINGGUAN,
					area_id: data.qingCity.id
				})
			}
	
		

			console.log(this.port_service_arr,'整理顺序问题');
			this.getRouteList()
			this.$store.state.publishCommonBody.port_service = this.port_service_arr.length > 0 ? this.port_service_arr.map(item => `demand:${item.demand},area_id:${item.area_id}`).join(';') : ''
			this.showServiceModal = false
		},
		async getRouteList() {
			console.log(this.port_service_arr,'获取路线列表')
			const res = await getRouteList({
				user_id: uni.getStorageSync('user_id'),
				departure_id: this.$store.state.publishCommonBody.departure_id,
				reach_id: this.$store.state.publishCommonBody.reach_id,
				port_service: this.port_service_arr.length > 0 ? this.port_service_arr.map(item => `demand:${item.demand},area_id:${item.area_id}`).join(';') : '',
				delivery_type: 0 //0普通 1专业
			})
			console.log(this.routeList ,$t('获取路由列表接口'))
			this.routeList = res.data.data.data
		},
		log(e) {
			console.log(e);
		}
	}
}
</script>

<template>
	<view class="publish flex between flex-col">
		<Modal :show.sync="remarkModalShow" :title="$t('输入订单备注')">
			<div style="width: 100%;">
				<div class="pl-40 pr-40">
					<textarea v-model="remark" :placeholder="$t('输入服务需求等')"
						class="w-full text-333 bg-gray-700 rounded-18 p-20"></textarea>
					<div class="fz26 text-888 mt-20 mr-10" style="text-align: right;">{{ remark.length }}/100</div>
					<div class="bg-primary h-80 center rounded-50 text-white pl-25 pr-25 mr-14 mt-30 mb-50"
						@click="remarkConfirm">
						{{$t('确定')}}
					</div>
				</div>
			</div>
		</Modal>

		<Modal :show.sync="showTelModal" :title="$t('请输入联系电话')">
			<div class="pl-40 pr-40">

				<input type="number" v-model="tel" :placeholder="$t('请输入联系电话')"
					class="w-full text-333 bg-gray-700 rounded-18 h-80 pl-20 pr-20" ref="telInput">
				<div class="center">
					<div class="mt-20 fz26  pt-20 pb-20 rounded-10 w-full"
						style="background: #ffef9f;color: #957f14;border: 1px solid #f7d31b;text-align: center;">
						注意:请填写准确有效的{{$t('联系电话')}}</div>
				</div>
				<div class="bg-primary h-80 center rounded-50 text-white pl-25 pr-25 mr-14 mt-30 mb-50 w-full"
					@click="telConfirm">
					{{$t('确定')}}
				</div>
			</div>
		</Modal>

		<Modal :show.sync="showServiceModal" :title="$t('通关服务')">
			<div class="w-full" style="height: 80vh;overflow: auto;">
				<serviceForm @confirm="confirmService" />
			</div>
		</Modal>


		<div style="height:50rpx"></div>
		<div class="header">
			<div class="back center" @click="back">
				<image src="/static/icon/back.png" mode="widthFix" class="w-20"></image>
			</div>
			{{$t('确认订单')}}
		</div>

		<div class="content p-30 flex-1" style="padding-top: 0;overflow: auto;">
			<div class="bg-white rounded-26 p-15 "
				v-if="$store.state.publishCommonBody.goods_type != GoodsType.XIAOJIAN">

				<div class="flex pb-20" style="border-bottom: 1px solid #F0F0F0;"
					v-if="$store.state.publishCommonBody.goods_type != GoodsType.XIAOJIAN">
					<!-- 0不限 1其他 2汽运 3空运 4海运 5铁路 -->
					<image src="/static/pic/v1.png" mode="aspectFill" style="width: 200rpx;height: 120rpx"
						v-if="$store.state.publishCommonBody.transport_way == deliveryType.qiyun"></image>
					<image src="/static/pic/v2.png" mode="aspectFill" style="width: 200rpx;height: 120rpx"
						v-if="$store.state.publishCommonBody.transport_way == deliveryType.haiyun || $store.state.publishCommonBody.transport_way == deliveryType.tielu">
					</image>
					<image src="/static/pic/v3.png" mode="aspectFill" style="width: 200rpx;height: 120rpx"
						v-if="$store.state.publishCommonBody.transport_way == deliveryType.kongyun"></image>

					<div class="text-111 ml-20">
						<div class="flex" style="align-items: flex-end;"
							v-if="$store.state.publishCommonBody.size_title">
							<div class="fz40 font-bold">{{ $store.state.publishCommonBody.size_title }}</div>
							<!-- <div class="fz26 mb-5 ml-5">m</div> -->
						</div>
						<div class="fz28">

							{{ transportWayTypes.find(item => item.id ===
								$store.state.publishCommonBody.transport_way).name }}
							-
							{{ transportTypes.find(item => item.id ===
								$store.state.publishCommonBody.transport_type).name }}

							- {{ $store.state.publishCommonBody.vehicle_title }}

							x{{ $store.state.publishCommonBody.goods_num }}
						</div>
					</div>
				</div>

				<div v-if="routeListShow">
					<div class="w-full rounded-16  flex p-20 between" v-for="item in routeList"
						style="min-height:100rpx" v-if="get(item, 'area.mergename')">
						<div class="flex">
							<image src="/static/icon/start.png" v-if="item.address_type == 'departure'" mode="widthFix"
								class="w-40"></image>
							<image src="/static/icon/way.png" v-if="item.address_type == 'transfer'" mode="widthFix"
								class="w-40"></image>
							<image src="/static/icon/end.png" v-if="item.address_type == 'reach'" mode="widthFix"
								class="w-40"></image>
							<div class="ml-24">
								<div class="fz32 font-bold text-111">{{ get(item, "area.mergename") }}
									<span v-if="item.port_service == 2" class="serviceTag text-blue-2">{{$t('报关')}}</span>
									<span v-if="item.port_service == 3" class="serviceTag text-blue-2">{{$t('转关')}}</span>
									<span v-if="item.port_service == 4" class="serviceTag text-blue-2">{{$t('清关')}}</span>
								</div>
								<div class="fz24 mt-12 text-888" v-if="get(item, 'address.content')">{{ get(item,
									'address.content') }}

								</div>
							</div>
						</div>
						<div class="flag">
							<flag class="w-50" :country="get(item, 'area.country')" />
						</div>
					</div>
				</div>

				<div class="between pt-30 mb-20" style="border-top: 1rpx solid #F0F0F0;"
					v-if="$store.state.publishCommonBody.goods_type != GoodsType.XIAOJIAN">
					<div class="flex h-65 flex-1 mr-25 rounded-50" style="background: #F7F7F7;">
						<div class="bg-primary h-65 center rounded-50 text-white pl-25 pr-25 mr-14"> {{
							transportTypes.find(item => item.id ===
								$store.state.publishCommonBody.transport_type).name }}</div>
						<div class="fz26 text-333 font-bold">
							{{ $store.state.currentGoodsInfo.title }}
							/
							{{ $store.state.currentGoodsInfo.goods_weight }} {{
								$store.state.publishCommonBody.goods_type
									== GoodsType.DAJIAN ? '吨' : $t('千克') }}
							/
							{{ $store.state.currentGoodsInfo.goods_volume }}m³
							/
							{{ $store.state.currentGoodsInfo.package.title }}
						</div>
					</div>
					<image :style="{ transform: routeListShow ? 'rotate(0deg)' : 'rotate(180deg)' }"
						src="/static/icon/slide.png" mode="widthFix" class="w-65 h-65"
						@click="routeListShow = !routeListShow"></image>
				</div>


			</div>

			<div class="bg-white rounded-26 p-20 mt-20" @click="showServiceModal = true"
				v-if="['2', '3', '4'].some(id => this.$store.state.publishCommonBody.demand.split(',').includes(id)) && $store.state.publishCommonBody.goods_type != GoodsType.XIAOJIAN">
				<div class="between">

					<div class="flex-shirnk-0 mr-24">
						<div class="flex">
							<div class="text-555 fz28 flex">
								<image src="/static/icon/service.png" mode="widthFix" class="w-200"></image>
							</div>

						</div>

					</div>

					<div class="flex">
						<div class="fz28 text-333 font-bold" v-if="port_service_arr.length > 0">
							{{ port_service_arr.map(item => item.demand).includes(Demand.BAOGUAN) ? "报关" : "" }}
							{{ port_service_arr.map(item => item.demand).includes(Demand.ZHUANGUAN) ? "转关" : "" }}
							{{ port_service_arr.map(item => item.demand).includes(Demand.QINGGUAN) ? $t('清关') : "" }}
						</div>
						<div v-else class=" mr-16  fz24 rounded-30 pt-5 pb-5 pl-14 pr-14"
							style="background: #ffe4e4;color: #ff5757;">
							{{$t('需填写')}}:{{ $store.state.publishCommonBody.demand.split(',').map(Number).filter(item => item !=
								1).map(item =>
									demandList.find(ditem => ditem.value == item).label).join('、') }}
						</div>
						<image src="/static/icon/right-2.png" mode="widthFix" class="w-10 ml-15"></image>
					</div>
				</div>
			</div>

			<div class="bg-white rounded-26 p-20 mt-20"
				v-if="$store.state.publishCommonBody.goods_type != GoodsType.XIAOJIAN">
				<div class="between">
					<div class="flex">
						<div class="text-555 fz28">{{$t('需要装卸服务')}}</div>
					</div>
					<div class="flex fz28 text-333">
						<switch :checked="$store.state.publishCommonBody.is_load == 1" @change="e => {
							$store.state.publishCommonBody.is_load = e.detail.value ? 1 : 0;
						}" color="#60E089" style="transform: scale(.7);margin-left: -15rpx;" />
					</div>
				</div>
				<div class="between mt-20">
					<div class="flex">
						<div class="text-555 fz28">{{$t('需要仓储服务')}}</div>
					</div>
					<div class="flex fz28 text-333">
						<switch :checked="$store.state.publishCommonBody.is_stock == 1" @change="e => {
							$store.state.publishCommonBody.is_stock = e.detail.value ? 1 : 0;
						}" color="#60E089" style="transform: scale(.7);margin-left: -15rpx;" />
					</div>
				</div>
			</div>



			<div class="bg-white rounded-26 p-20 mt-20">
				<div class="between">
					<div class="flex">
						<div class="text-555 fz28">{{$t('装货时间')}}</div>
						<div class="bg-blue-2 text-blue fz22 rounded-30 text-blue-2 ml-24 pt-5 pb-5 pl-14 pr-14">{{$t('必填')}}
						</div>
					</div>
					<div class="flex fz28 text-333">
						<picker mode="date"   :start="startDate" @change="e => {
							if (new Date(e.detail.value).getTime() < new Date(new Date().setHours(0, 0, 0, 0)).getTime()) {
								toast('时间不能小于今日')
								$store.state.publishCommonBody.delivery_at = ''
								return
							}
							$store.state.publishCommonBody.delivery_at = e.detail.value
						}">
							<div class="flex">
								<view class="fz26 text-888"
									:class="{ 'text-333 font-bold': $store.state.publishCommonBody.delivery_at }">
									{{ $store.state.publishCommonBody.delivery_at ?
										$store.state.publishCommonBody.delivery_at :
										$t('请选择装货时间') }}
								</view>
								<image src="/static/icon/right-2.png" mode="widthFix" class="w-10 ml-15"></image>
							</div>
						</picker>
					</div>
				</div>



				<div class="between mt-40">
					<div class="flex">
						<div class="text-555 fz28">{{$t('订单备注')}}</div>
					</div>
					<div class="flex" @click="remarkModalShow = true">
						<div class="fz26 text-888">{{ $store.state.publishCommonBody.remark ?
							$store.state.publishCommonBody.remark.substring(0, 10) + "..." : $t('输入服务需求等') }}</div>
						<image src="/static/icon/right-2.png" mode="widthFix" class="w-10 ml-15"></image>
					</div>
				</div>

				<div class="between mt-40">
					<div class="flex">
						<div class="text-555 fz28">{{$t('联系电话')}}</div>
						<div class="bg-blue-2 text-blue fz22 rounded-30 text-blue-2 ml-24 pt-5 pb-5 pl-14 pr-14">{{$t('必填')}}
						</div>
					</div>
					<div class="flex" @click="showTelModal = true;">
						<div class="fz26 text-888">{{ $store.state.publishCommonBody.tel ?
							$store.state.publishCommonBody.tel : $t('请输入联系电话') }}</div>
						<image src="/static/icon/right-2.png" mode="widthFix" class="w-10 ml-15"></image>
					</div>
				</div>



			</div>
			<div class="bg-white rounded-26 p-20 mt-20">
				<!-- {{ $store.state.currentGoodsInfo }} -->
				<!-- props: ["label", "value", "more", "valueColor"] -->
				<!-- <InfoItem class="mb-40" label="货物名称" :value="$store.state.currentGoodsInfo.title" />
				<InfoItem class="mb-40" label="包装方式" :value="$store.state.currentGoodsInfo.package_name" />
				<InfoItem class="mb-40" label="货物重量" :value="$store.state.currentGoodsInfo.goods_weight + '千克'" />
				<InfoItem class="mb-40" label="货物密度" :value="$store.state.currentGoodsInfo.goods_volume + 'm³'" />
				<InfoItem class="mb-40" label="物品件数" :value="$store.state.currentGoodsInfo.goods_num" /> -->
				<!-- <InfoItem class="mb-40" :label="$t('付款方式')" :value="$t('寄付现结')" more="true" /> -->

				<div class="between">
					<div class="flex">
						<div class="text-555 fz28">{{$t('货主出价')}}</div>
						<!-- <div class="bg-blue-2 text-blue fz22 rounded-30 text-blue-2 ml-24 pt-5 pb-5 pl-14 pr-14">{{$t('必填')}}
						</div> -->
					</div>
				</div>
				<div class="between mt-20">
					<div class="relative flex-1 flex rounded-18 bg-gray-700 h-80 w-full mr-30 fz28">
						<div class="fz30 text-gray-3d3d3d font-bold h-80 center pb-5 pl-30 mr-10 flex flex-shrink-0">
							{{ currency.getSymboleByCode($store.state.publishCommonBody.price_unit) }}
							({{ $store.state.publishCommonBody.price_unit }})
						</div>
						<input type="number" class="h-full w-full pt-5" :placeholder="$t('请输入出价')" @input="(e) => {
							$store.state.publishCommonBody.price = e.target.value
						}">
					</div>




					<!-- <div class="rounded-18 bg-gray-700 text-gray-500 h-80 w-100 center  ml-30" @click="changePriceUnit">
						<text class="mr-5 text-gray-500"
							:class="{ 'text-blue-2': $store.state.publishCommonBody.price_unit == '￥' }">￥</text>
						/
						<text class="ml-10 text-gray-500"
							:class="{ 'text-blue-2': $store.state.publishCommonBody.price_unit == '₽' }">₽</text>
					</div> -->
				</div>
				<div class="between mt-20 mb-20">
					<div class="text-555 fz28">{{$t('货币种类')}}</div>
				</div>
				<currency :disabled="false" :currency="$store.state.publishCommonBody.price_unit" @confirm="(e) => {
					$store.state.publishCommonBody.price_unit = e.code;
				}"></currency>

			</div>

			<Modal :show.sync="checkedModalShow" :title="$t('货运区间服务相关协议')">
				<div class="w-full" style="height: 80vh;overflow: auto;">
					<div class="pl-40 pr-40 mb-50" v-if="deliveryData[0]">
						{{ lang }}
						<rich-text :nodes="deliveryData[0].content" v-if="lang == 'zh'"></rich-text>
						<rich-text :nodes="deliveryData[1].content" v-else></rich-text>
					</div>
				</div>
			</Modal>
			<div class="fz24 text-888 mt-20 flex">
				<radio :checked="isChecked" @click="isChecked = !isChecked" style="transform: scale(0.8);" />
				<div>
					{{$t('我已阅读并同意')}}
					<text class="text-blue-2" @click="checkedModalShow = true">《{{$t('货运区间服务相关协议')}}》</text>
				</div>
			</div>

			<!-- <TestData /> -->

			<div style="height: 200rpx;"></div>
		</div>



		<div class="form-control p-30 bg-white">
			<div class="submit center h-100 bg-primary text-white fz32 rounded-50" @click="submit">
				{{$t('立即下单')}}
			</div>
		</div>

	</view>
</template>


<style lang="less">
.serviceTag {
	background-color: #e7f2ff;
	border-radius: 10rpx;
	padding: 8rpx 20rpx;
	font-size: 24rpx;
	margin-left: 16rpx;
}

.flag {
	border-left: 1rpx solid #ddd;
	padding-left: 20rpx;
}

.relative {
	position: relative;
}

.bg-gray-700 {
	background: #F7F7F7;
}

.file-item {
	background-color: #F7F7F7;
	border-radius: 18rpx;
	height: 88rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 25rpx;
}

.count {
	background-color: #F7F7F7;
	height: 50rpx;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 300rpx;
	border-radius: 25rpx;
	overflow: hidden;

	.span {
		color: #1d1d1d;
		width: 100rpx;
		height: 50rpx;
		display: flex;
		background-color: #F3F3F3;
		align-items: center;
		justify-content: center;

		&:active {
			background-color: #ddd;
		}
	}

	.input {
		text-align: center;
		font-size: 28rpx;
	}
}

.radio {
	border: 1rpx solid #999;
	width: 30rpx;
	height: 30rpx;
	border-radius: 50%;
}

.checked {
	border: 8rpx solid #278AFF;
}

.bg-gray-600 {
	background-color: #F6F7FB;
}

.form-control {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 9;
}

.header {
	font-size: 34rpx;
	height: 100rpx;
	line-height: 100rpx;
	font-weight: bold;
	text-align: center;
	position: relative;
	padding-top: var(--status-bar-height);
}

.back {
	position: absolute;
	width: 70rpx;
	height: 70rpx;
	top: 18rpx;
}

page {
	height: 100%;
	width: 100%;
}

.publish {
	height: 100%;
	align-items: stretch;
	background: #F6F7FB url("/static/bg/publish.png") no-repeat;

}
</style>